Vue.use(httpVueLoader);

window.createGrayVue = new Vue({
    el: '#tempo-ai-gray-config',
    data: function () {

        /**
         * 发布策略自定义校验
         */
        var checkServiceName1 = function(rule, value, callback) {
            if(value != "" && JSON.stringify(value) === JSON.stringify(createGrayVue.grayConfigForm1.serviceName2)) {
                callback(new Error(TempoUtils.locale("aiview.sync_service2")));
            } else if(value == ""){
                callback(new Error(TempoUtils.locale("aiview.required-select")));
            } else {
                if(createGrayVue.oriMetaEquals) {
                    callback();
                } else {
                    callback(new Error(TempoUtils.locale("aiview.service_yuan_message")));
                }

            }
        };
        var checkServiceName = function (rule, value, callback) {
            if(value.length > 60){
                callback(new Error(TempoUtils.locale("aiview.service_gray_name_length")));
            }
            if(value != ""){
                $.ajax({
                    url: contextPath + '/api/ai/mine/gray/exit-gray-name',
                    method: 'POST',
                    dataType: 'json',
                    data:{
                        name : value
                    },
                    success: function(data) {
                        if(data.success){
                            callback(new Error(TempoUtils.locale("aiview.service_gray_name")));
                        }else {
                            callback();
                        }
                    }
                })
            }else if (value == ""){
                callback(new Error(TempoUtils.locale("aiview.required")));
            }
        };
        var checkServiceName2 = function(rule, value, callback) {
            if(value != "" && JSON.stringify(value) === JSON.stringify(createGrayVue.grayConfigForm1.serviceName1)) {
                callback(new Error(TempoUtils.locale("aiview.sync_service1")));
            }else if (value == ""){
                if(createGrayVue.grayConfigForm1.serviceName1 != "" && createGrayVue.grayConfigForm1.serviceName1.length > 0){
                    createGrayVue.$refs["grayConfigRef1"].clearValidate("serviceName1");
                }
                createGrayVue.$refs["grayConfigRef1"].clearValidate("serviceName2");
                createGrayVue.oriMetaEquals = true;
                callback();
            }else {
                if(createGrayVue.oriMetaEquals) {
                    callback();
                } else {
                    callback(new Error(TempoUtils.locale("aiview.service_yuan_message")));
                }
            }
        };
        var checkServiceAddr1 = function(rule, value, callback) {
            if(value.length > 60){
                callback(new Error(TempoUtils.locale("aiview.service_gray_name_length")));
            }
            if(createGrayVue.grayConfigForm1.serviceAddr === "" || createGrayVue.grayConfigForm1.serviceAddr === null){
                callback(new Error(TempoUtils.locale("aiview.serviceAliasNotNull")));
            }
            var va = createGrayVue.grayConfigForm1.serviceAddr.replace(/[^A-Za-z0-9_]/g,"");
            if(va == createGrayVue.grayConfigForm1.serviceAddr){
                $.ajax({
                    url: contextPath + '/api/ai/mine/gray/exit-gray-addr',
                    method: 'POST',
                    dataType: 'json',
                    data:{
                        address : value
                    },
                    success: function(data) {
                        if(data.success){
                            callback(new Error(TempoUtils.locale("aiview.service_gray_addr")));
                        }else {
                            callback();
                        }
                    }
                });
            }else if(createGrayVue.grayConfigForm1.serviceAddr == ""){
                createGrayVue.$refs["grayConfigRef1"].clearValidate("serviceAddr");
                callback();
            }else {
                callback(new Error(TempoUtils.locale("aiview.grayAlias")));
            }
        };

        return {
            //发布的同步服务树形数据
            syncFlowOptions: [],
            //自定义树形数据
            syncFlowProps: {
                value: "ID",
                label: "NAME",
                children: "children"
            },
            grayConfigForm1: {
                name: "",
                serviceAddr: "",
                serviceName1: "",
                serviceName2: "",
                publishType: "0",
                serviceValue1: 80,
                serviceValue2: 20,
                selectValue: "0",
            },
            grayConfigRule1: {
                name: [
                    {
                        required: true,
                        validator:checkServiceName,
                        trigger: "blur"
                    }
                ],
                serviceAddr: [
                    {
                        required: true,
                        validator:checkServiceAddr1,
                        trigger: "blur"
                    }
                ],
                serviceName1: [
                    {
                        required: true,
                        trigger: 'blur',
                        validator: checkServiceName1
                    }
                ],
                serviceName2: [
                    {
                        validator: checkServiceName2,
                        trigger: 'blur'
                    }
                ],
                serviceValue1: [
                    {
                        required: true,
                        message: TempoUtils.locale("aiview.required"),
                        trigger: "blur"
                    }
                ],
                serviceValue2: [
                    {
                        required: true,
                        message: TempoUtils.locale("aiview.required"),
                        trigger: "blur"
                    }
                ],
                selectValue: [
                    {
                        required: true,
                        message: TempoUtils.locale("aiview.required"),
                        trigger: "blur"
                    }
                ]
            },
            oriMetaEquals: true,
        }
    },
    methods: {
        /**
         * 获取同步流程树结构
         */
        getSyncTree: function () {
            var _this = this;
            $.ajax({
                url: contextPath + '/api/ai/mine/gray/get-all-syncservice',
                method: 'POST',
                data: {
                    workSpaceId: $(".theme-container").attr("workSpaceId"),
                    flagChengGuo: false
                },
                success: function(data) {
                    if(data.success){
                        _this.syncFlowOptions = data.data;
                    }
                }
            })
        },
        getServiceAddr: function(){
            var _this = this;
            _this.$refs["grayConfigRef1"].validateField("serviceAddr");

        },
        getSameMessage1: function(value){
            var _this = this;
            //改变选中同步服务时清空校验
            _this.$refs["grayConfigRef1"].clearValidate("serviceName1");
            _this.$refs["grayConfigRef1"].clearValidate("serviceName2");
            _this.$refs["grayConfigRef1"].validateField("serviceName1");
            if(_this.grayConfigForm1.serviceName1 != ""){
                $.ajax({
                    url: contextPath + '/api/ai/mine/gray/get-sync-name',
                    method: 'POST',
                    dataType: 'json',
                    data:{
                        id : value[value.length-1],
                    },
                    success: function(data) {
                        $("#syncServiceName1").attr("title",data.data);
                    }
                })
            }
            if(_this.grayConfigForm1.serviceName2 != ""){
                //选中的两个同步服务元信息是否相同
                $.ajax({
                    url: contextPath + '/api/ai/mine/gray/get-same-massage',
                    method: 'POST',
                    dataType: 'json',
                    data:{
                        syncService1 : value[value.length-1],
                        syncService2 : _this.grayConfigForm1.serviceName2[_this.grayConfigForm1.serviceName2.length-1]
                    },
                    success: function(data) {
                        if(data.success){
                            _this.oriMetaEquals = true;
                            _this.$refs["grayConfigRef1"].validateField("serviceName1");
                            return;
                        }else {
                            _this.oriMetaEquals = false;
                            _this.$refs["grayConfigRef1"].validateField("serviceName1");
                        }
                    }
                })
            }
        },
        getSameMessage2: function(value){
            $("#syncServiceName2").attr("title","");
            var _this = this;
            //改变选中同步服务时清空校验
            _this.$refs["grayConfigRef1"].clearValidate("serviceName1");
            _this.$refs["grayConfigRef1"].clearValidate("serviceName2");
            _this.$refs["grayConfigRef1"].validateField("serviceName2");
            if(_this.grayConfigForm1.serviceName2 != ""){
                $.ajax({
                    url: contextPath + '/api/ai/mine/gray/get-sync-name',
                    method: 'POST',
                    dataType: 'json',
                    data:{
                        id : value[value.length-1],
                    },
                    success: function(data) {
                        $("#syncServiceName2").attr("title",data.data);
                    }
                })
            }
            if(_this.grayConfigForm1.serviceName1 != "" && _this.grayConfigForm1.serviceName2 != "" && _this.grayConfigForm1.serviceName2.length !=0){
                $.ajax({
                    url: contextPath + '/api/ai/mine/gray/get-same-massage',
                    method: 'POST',
                    dataType: 'json',
                    data:{
                        syncService1 : _this.grayConfigForm1.serviceName1[_this.grayConfigForm1.serviceName1.length-1],
                        syncService2 : value[value.length-1],
                    },
                    success: function(data) {
                        if(data.success){
                            _this.oriMetaEquals = true;
                            _this.$refs["grayConfigRef1"].validateField("serviceName2");
                            return;
                        }else {
                            _this.oriMetaEquals = false;
                            _this.$refs["grayConfigRef1"].validateField("serviceName2");
                        }
                    }
                })
            }
        },
        handleChange1: function (value) {
            var _this = this;
            _this.grayConfigForm1.serviceValue2 = 100-value;
        },
        handleChange2: function (value) {
            var _this = this;
            _this.grayConfigForm1.serviceValue1 = 100-value;
        },
        mouseover:function () {
            if($("#gray-helpInfo").length > 0){
                $("#gray-helpInfo").show();
            }else {
                var helpInfoHtml = "<div id='gray-helpInfo' style='background: rgb(243, 245, 247);position:absolute;position:absolute;width:315px;height:70px;backgroud:#e0e5e5;box-shadow:0px 0px 10px #dae0e9;z-index:1000;'>" +
                    "<p style='padding-left:15px;height:20px;'>" + TempoUtils.locale("aiview.qzfw") + "</p>" +
                    "<p style='padding-left:15px;height:20px;'>" + TempoUtils.locale("aiview.qzbk") + "</p>" +
                    "<p style='padding-left:15px;height:20px;'>" + TempoUtils.locale("aiview.mrqz") + "</p></div>";
                $(helpInfoHtml).appendTo($("#sync1"));
            }
        },
        mouseLeaver:function () {
            $("#gray-helpInfo").hide();
        },
        nameBlur: function () {
            var _this = this;
            $("#grayServiceName").attr("title",_this.grayConfigForm1.name);
        },
        addrBlur:function () {
            var _this = this;
            $("#grayServiceAddr").attr("title",_this.grayConfigForm1.serviceAddr);
        }
    },
    mounted: function () {
        this.getSyncTree();
    }
});